<template>
  <div>
      <!-- 轮播图 -->
      <div class="banner">
          <banner />
      </div>
      <!-- 小菜单 -->
      <div class="sub-menu">
          <sub-menu @listenSort="changeSort" />
      </div>
      <!-- 博客列表 -->
      <div class="blog-list">
        <blog-list ref="blogList" />
      </div>
      <!-- 分页组件 -->
      
  </div>
</template>

<script>
import banner from './banner.vue'
import subMenu from './sub-menu.vue'
import blogList from './blog-list.vue'

export default {
    components: {
        banner,
        subMenu,
        blogList
    },
    methods: {
        // 小菜单选中触发   
        changeSort(sort) {
            this.$refs.blogList.setSort(sort)  // this.$refs是获取你当前页面所有子组件注册信息的集合
        }
    }
}
</script>

<style>

</style>